<template>
  <el-tabs tab-position="top" v-model="currentTab" @tab-click="handleClick">
    <el-tab-pane label="支付配置" name="payment"><PaymentList /></el-tab-pane>
    <el-tab-pane label="短信配置" name="sms" lazy><SmsList /></el-tab-pane>
    <el-tab-pane label="地图配置" name="map" lazy><MapList /></el-tab-pane>
    <el-tab-pane label="推送配置" name="push" lazy><PushList /></el-tab-pane>
    <el-tab-pane label="通知配置" name="notify" lazy><NotifyList /></el-tab-pane>
  </el-tabs>
</template>

<script lang="ts" setup>

import {TabsPaneContext} from 'element-plus'
import PushList from '@/views/system/func/push/list.vue'
import NotifyList from '@/views/system/func/notify/list.vue'
import MapList from '@/views/system/func/map/list.vue'
import SmsList from '@/views/system/func/sms/list.vue'
import PaymentList from '@/views/system/func/payment/list.vue'
const currentTab = ref('payment')

const handleClick = (tab: TabsPaneContext, event: Event) => {
}
</script>

<style lang="scss" scoped>

:deep(.el-tabs__header) {

}
:deep(.el-tabs__content) {

}
:deep(.el-tabs__nav-wrap){
  background-color: white;
  padding: 0 15px;

  border: 0 solid var(--el-border-color-light);

}

:deep(.el-tabs__nav-wrap::after){
  height: 1px !important;
}
:deep(.el-tabs__item){
  height: 50px;
  line-height: 50px;
}
</style>
